<script setup lang="ts">
import { propTypes } from '@/utils/propTypes'
import { PropType ,computed,useAttrs} from 'vue'

const props = defineProps({
  modelValue: propTypes.bool.def(false),
  loading: propTypes.bool.def(false),
  icon: propTypes.string.def(''),
  title: propTypes.string.def(''),
  type: propTypes.oneOf(['', 'primary', 'success', 'warning', 'danger', 'info']).def('primary'),
  circle: propTypes.bool.def(false),
  round: propTypes.bool.def(false),
  plain: propTypes.bool.def(false),
  onClick: { type: Function as PropType<(...args) => any>, default: null }
})
const getBindValue = computed(() => {
  const delArr: string[] = ['title', 'icon', 'onClick']
  const attrs = useAttrs()
  const obj = { ...attrs, ...props }
  for (const key in obj) {
    if (delArr.indexOf(key) !== -1) {
      delete obj[key]
    }
  }
  return obj
})
</script>

<template>
  <el-button link v-bind="getBindValue" @click="onClick">
    <el-tooltip v-if="icon" :content="title" placement="top">
      <Icon :icon="icon"  class="mr-1px" />
    </el-tooltip>
    <view v-else>{{title}}</view>
  </el-button>
</template>
<style lang="less" scoped>

</style>
